<!DOCTYPE html>
<html lang="en" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
    <meta charset="utf-8">
    <meta name="x-apple-disable-message-reformatting">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
    <meta name="color-scheme" content="light dark">
    <meta name="supported-color-schemes" content="light dark">
    <!--[if mso]>
    <noscript>
        <xml>
            <o:OfficeDocumentSettings xmlns:o="urn:schemas-microsoft-com:office:office">
                <o:PixelsPerInch>96</o:PixelsPerInch>
            </o:OfficeDocumentSettings>
        </xml>
    </noscript>
    <style>
        td, th, div, p, a, h1, h2, h3, h4, h5, h6 {
            font-family: "Segoe UI", sans-serif;
            mso-line-height-rule: exactly;
        }
    </style>
    <![endif]-->
    <title>OBAS - Drop in your scenario results</title>
    <style>
        @media (max-width: 600px) {
            .sm-my-8 {
                margin-top: 32px !important;
                margin-bottom: 32px !important
            }

            .sm-px-4 {
                padding-left: 16px !important;
                padding-right: 16px !important
            }

            .sm-px-6 {
                padding-left: 24px !important;
                padding-right: 24px !important
            }

            .sm-leading-8 {
                line-height: 32px !important
            }
        }
    </style>
</head>
<body style="margin: 0; width: 100%; background-color: #F1F5F9; padding: 0; -webkit-font-smoothing: antialiased; word-break: break-word">
<div role="article" aria-roledescription="email" aria-label="OBAS - Drop in your scenario results" lang="en">
    <div class="sm-px-4"
         style="background-color: #F1F5F9; font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif">
        <table align="center" cellpadding="0" cellspacing="0" role="none">
            <tr>
                <td style="width: 552px; max-width: 100%">
                    <div class="sm-my-8" style="margin-bottom: 40px; margin-top: 40px; text-align: center">
                        <#if custom_logo_b64?has_content>
                            <img src="data:image/png;base64,${custom_logo_b64}" width="320"
                            alt="Custom logo" style="max-width: 100%; vertical-align: middle" />
                        <#else>
                            <img src="" width="320"
                            alt="OpenBAS logo" style="max-width: 100%; vertical-align: middle"/>
                        </#if>
                    </div>
                    <table style="width: 100%;" cellpadding="0" cellspacing="0" role="none">
                        <tr>
                            <td class="sm-px-6"
                                style="border-radius: 4px; background-color: #fff; padding: 48px; font-size: 16px; color: #00020c; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05)">
                                <h2 class="sm-leading-8"
                                    style="margin: 0 0 24px; text-align: center; font-size: 24px; font-weight: 700">
                                    ALERT: Drop in risk detection score
                                </h2>
                                <h4 style="text-align: center;">Scenario: ${scenario_name}</h4>
                                <table align="center" cellpadding="0" cellspacing="0" role="none">
                                    <tr>
                                        <td style="background-color: #fecaca; padding: 15px;">
                                            <h4 style="font-weight: 700;"><span style="color: #ec1d0b">-${decrease_prev}%</span>
                                                on Prevention & <span
                                                        style="color: #ec1d0b">-${decrease_detect}%</span> on
                                                Detection</h4>
                                        </td>
                                    </tr>
                                </table>
                                <table role="presentation"
                                       style="width: 100%; table-layout: fixed; border-collapse: collapse"
                                       cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td style="width: 50%; padding: 20px">
                                            <h5 style="font-weight: 700;">Previous simulation</h5>
                                            <div>Date: ${prev_simulation_date}</div>
                                            <div>Detection: ${prev_percentage_detection}%</div>
                                            <div>Prevention: ${prev_percentage_prevention}%</div>
                                        </td>
                                        <td style="width: 50%; padding: 20px;">
                                            <h5 style="font-weight: 700;">New simulation</h5>
                                            <div>Date: ${new_simulation_date}</div>
                                            <div>Detection: ${new_percentage_detection}% <span
                                                    style="color: #ec1d0b">(&#8595;-${decrease_detect}%)</span></div>
                                            <div>Prevention: ${new_percentage_prevention}%<span
                                                    style="color: #ec1d0b">(&#8595;-${decrease_prev}%)</span></div>
                                        </td>
                                    </tr>
                                </table>
                                <table style="width: 100%;" cellpadding="0" cellspacing="0" role="none">
                                    <tr>
                                        <td>
                                            <div style="padding-top: 32px">
                                                <div style="text-align: center;">
                                                    <a href="${scenarioLink}"
                                                       style="display: inline-block; border-radius: 4px; padding: 16px 24px; font-size: 16px; line-height: 1; font-weight: 600; text-decoration: none; color: #F4F4F6; background-color: #001BDB">
                                                        <!--[if mso]>
                                <i style="mso-font-width: 150%; mso-text-raise: 30px" hidden>&emsp;</i>
                              <![endif]-->
                                                        <span style="mso-text-raise: 16px">
                          Access scenario
                        </span>
                                                        <!--[if mso]>
                                <i hidden style="mso-font-width: 150%;">&emsp;&#8203;</i>
                              <![endif]-->
                                                    </a>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center" style="padding: 28px">
                                            <a href="${instanceLink}">
                                                ${instanceLink}
                                            </a>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr>
                        </tr>
                        <#if hide_filigran_logo == "false">
                            <td style="padding-left: 24px; padding-right: 24px; text-align: center; font-size: 12px; color: #00020c; padding-top: 28px">
                                <p>OpenBAS - Breach & Attack Simulation Platform</p>
                                <div style="margin-bottom: 8px">
                                    <img src=""
                                    alt="Filigran logo" width="120" style="max-width: 100%; vertical-align: middle;">
                                </div>
                                <p style="margin: 0 0 40px;">New York, Paris, London, Sydney</p>
                            </td>
                        </#if>
                    </table>
                </td>
            </tr>
        </table>
    </div>
</div>
</body>
</html>